<template>
    <!--<img src="./gxxq.png" alt=""/>-->
    <!--上报信息页面-->
    <section class="contribution-details">
        <div class="ReportInformation">
            <wioc-card shadow="shadow" border="radius" title="上报信息" titlesize="small">
                <div slot="title-before" class="titleBefore">
                    <wioc-icon-svg name="icon-shiminshangbaoxinxi"></wioc-icon-svg>
                </div>
                <div slot="sub-title" class="titleSub">
                    <wioc-list-tags :taglist="tagList"></wioc-list-tags>
                </div>
                <div slot="title" class="time">{{reportData.time|formatDate('yyyy-MM-dd')}}</div>
                <div class="detailsInfo" >
                    <table style="width: 100%">
                        <tr>
                            <th>类型：</th><td>{{reportData.type}}</td>
                        </tr>
                        <tr>
                            <th>位置：</th><td>{{reportData.position}}</td>
                        </tr>
                        <tr>
                            <th>详情：</th><td>{{reportData.desc}}</td>
                        </tr>
                        <tr>
                            <th>附件:</th><td></td>
                        </tr>
                        <tr >
                            <th></th><td style="display: flex;justify-content: left"> <div v-for="pathItem in reportData.attachment">
                            <img  class="img" :src="pathItem" style="width: 0.7rem;height: 0.7rem;margin-right: 0.05rem;border-radius: 0.05rem" >
                        </div></td>
                        </tr>
                    </table>
                </div>
            </wioc-card>
        </div>
    </section>


</template>

<script>
    export default {
        name: "wioc-report-information",
        props:[
            "reportData","tagList"
        ],
        data(){
            return {
               /* tagList: [{
                    name: ''
                }],*/
            }
        }
    }
</script>
<style lang="less" scoped>
    .contribution-details{
        font-family: PingFangSC-Regular;
        .ReportInformation{
            .wioc-card {
                /deep/ .title{
                    display: flex;
                    flex-direction: row;
                    .small{
                        padding-top: 0.04rem;
                        font-family: PingFangSC-Regular;
                        font-size: 0.15rem;
                        color: #595959;
                        letter-spacing: -0.13px;
                    }
                    .titleBefore{
                        //flex:1;
                        width: 0.23rem;
                        height: 0.23rem;
                        padding-right: 0.05rem;
                    }
                    .titleSub{
                        flex:1;
                        padding-left: 0.07rem;
                        .wioc-list-tags li{
                            padding: 0 0.04rem;
                            margin: unset;
                            line-height: 0.21rem;
                        }
                    }
                    .time{
                        flex:2;
                        padding-top: 0.02rem;
                        margin-right: 0.05rem;
                        font-size: 0.13rem;
                    }
                }
                /deep/  .content {
                    padding-top: 0.08rem;
                    .detailsInfo{
                        border-top: 0.01rem solid #EBEDF8;
                        table tr{
                            line-height:0.36rem ;
                            th{
                                font-size: 0.11rem;
                                color: #C0C4CC;
                                text-align: left;
                                font-weight: normal;
                                //padding-left: 0.14rem;
                            }
                            td{
                                font-size: 0.13rem;
                                color: #595959;
                                text-align: right;
                                //padding-right: 0.31rem;
                            }
                        }
                    }
                }

            }
        }
    }
</style>
